<template>
	<view class="body">
		<view class="addreserve" @click="$utils.navTo('/pages/reserve/addreserve')">
			<p>我要</p>
			<text>约课</text>
		</view>
		<view class="record" v-for="item in list">
			<view class="top">
				<view class="photo">
					<image src="../../assets/img/tx.png" mode=""></image>
				</view>
				<view class="message">
					<p class="title">3月17日 {{item.name}}</p>
					<p class="kecheng">预约课程：{{item.coruseName}}</p>
					<p class="kecheng">预约时间：{{item.retime}}</p>
					<p class="kecheng">联系人：{{item.name}}</p>
					<p class="kecheng">联系电话：{{item.tel}}</p>
					<p class="kecheng">学生性别：{{item.sex==0?'男':'女'}}</p>
					<p class="kecheng">学生年龄：{{item.age}}</p>
					<view class="remark">{{item.remarks}}</view>
				</view>
			</view>
			<view class="bottom">
				<p>提交时间：{{item.addtime}}</p>
			</view>
		</view>
	</view>
</template>

<script>
	import {getreservelist} from '../../api/index.js'
	export default {
		data(){
			return{
				params:{
					page:1,
					psize:20
				},
				list:[],
				sname:uni.getStorageSync('userinfo')
			}
		},
		methods:{
			async getlist(){
				let res = await getreservelist(this.params)
				console.log(res)
				this.list=res.data.list
			}
		},
		onLoad(){
			this.getlist()
		}
	}
</script>

<style scoped lang="less">
	.body{
		border-bottom:1rpx solid #f2f3f5 ;
		min-height: 100vh;
		padding-top: 20rpx;
		width: 750rpx;
		background-color: #f2f3f5;
		.addreserve{
			text-align: center;
			position: fixed;
			z-index: 99;
			right: 35rpx;
			bottom: 365rpx;
			width: 110rpx;
			height: 110rpx;
			color: #FFFFFF;
			background-color: #3d9ef3;
			font-size: 27rpx;
			border-radius: 50%;
			p{
				margin-top: 20rpx;
			}
		}
		.record{
			width: 690rpx;
			height: 500rpx;
			margin-bottom: 20rpx;
			margin-left: 30rpx;
			padding-top: 45rpx;
			box-sizing: border-box;
			background-color: #FFFFFF;
			border-radius: 10rpx;
			.top{
				display: flex;
				border-bottom: 1rpx solid #f6f6f6;
				.photo{
					width: 120rpx;
					image{
						width: 73rpx;
						height: 73rpx;
						border-radius: 10rpx;
						margin-left: 30rpx;
					}
				}
				.message{
					flex: 1;
					.title{
						font-size: 34rpx;
						font-weight: 600;
						margin-bottom: 20rpx;
					}
					.kecheng{
						font-size: 21rpx;
						color: #35409d;
						margin-bottom: 15rpx;
					}
					.remark{
						margin: 15rpx 0;
						font-size: 26rpx;
					}
				}
			}
			.bottom{
				height: 90rpx;
				display: flex;
				align-items: center;
				font-size: 21rpx;
				padding-left: 26rpx;
				box-sizing: border-box;
				color: #cbccce;
			}
		}
	}
</style>
